<template>
	<view>
		<uni-nav-bar :statusBar="true" dark title="切换联赛" fixed left-icon="left" @clickLeft="clickLeft">
			<block slot="right">
				<view class="city">
					<view @click="onCreated">
						<uni-icons color="#fff" fontFamily="CustomFont" type="plusempty" :size="20"></uni-icons>
					</view>
				</view>
			</block>
		</uni-nav-bar>
		<view>
			<uni-search-bar clearButton="none" cancelButton="none" @confirm="search"></uni-search-bar>
		</view>
		<view class="list" v-for="(item, index) in list" :class="{cur: selectId == item.id}" :key="index"
			@click="onclick(item,item.auditStatus)">
			<view class="item">
				<image src="@/static/images/basketball.png" mode=""></image>
				<view class="center">
					<text>{{item.contestName}}</text>
					<text class="font-color-def">进行中</text>
				</view>
			</view>

			<view class="status">
				<view v-if="item.auditStatus == 1" style="padding-right: 20rpx;color: green;"
					@click="goNewPage(1,item)">
					审核通过
				</view>
				<view v-else-if="item.auditStatus == 2" style="padding-right: 20rpx;color: red;" @click="goNewPage(2)">
					审核失败
				</view>
				<view v-else style="padding-right: 20rpx;" @click="goNewPage(0)">
					审核中
				</view>
				<view>
					{{item.createUserName}}
				</view>
			</view>
		</view>
		<uni-load-more :status="loadingType"></uni-load-more>
	</view>
</template>

<script>
	import {
		getcontestlist
	} from '@/api/contest/index.js'
	import {
		changeStatus
	} from '@/api/system/user.js';
	import {
		setToken,
	} from '@/utils/auth'
	export default {
		data() {
			return {
				list: [],
				selectId: '',
				pageData: {
					pageSize: 20,
					pageNum: 1
				},
				total: 0,
				loadingType: 'more'
			}
		},
		methods: {
			clickLeft() {
				uni.navigateBack()
			},
			goNewPage(staus, item) {
				if (staus == 0) {
					uni.navigateTo({
						url: '/pages/createCompetition/stausIng'
					})
				} else if (staus == 1) {
					console.log(item, "-------")
					this.onclick(item)
				} else {
					uni.navigateTo({
						url: '/pages/createCompetition/stausFail'
					})
				}
			},
			getList(contestName = '') {
				getcontestlist({
					...{
						contestName
					},
					...this.pageData
				}).then(res => {
					this.total = res.total
					this.list.push(...res.rows)
					if (this.list.length == this.total) {
						this.loadingType = 'no-more'
						return;
					}
				})
			},
			search(val) {
				console.log(val)
				this.pageData = {
					pageNum: 1,
					pageSize: 20
				}
				this.list = []
				this.getList(val.value);
			},
			onclick(item, staus) {
				if (staus == 0) {
					uni.navigateTo({
						url: '/pages/createCompetition/stausIng'
					})
				} else if (staus == 2) {
					uni.navigateTo({
						url: '/pages/createCompetition/stausFail'
					})
				} else {
					this.selectId = item.id;
					uni.setStorageSync('contestId', item.id);
					uni.setStorageSync('scoringWay', item.scoringWay);
					let userId = uni.getStorageSync('userId')
					changeStatus({
						organizationId: item.organizationId,
						contestId: this.selectId,
						userId
					}).then(res => {
						if (res.data && res.data.access_token) {
							setToken(res.data.access_token)
							// setToken(res.token)
							this.$store.commit('SET_TOKEN', res.data.access_token)
							uni.switchTab({
								url: '/pages/home/home'
							})
						} else {
							this.$modal.msg('已切换到当前联赛')
						}

					})
				}
			},
			onCreated() {
				uni.navigateTo({
					url: '/pages/createCompetition/createCompetition?back=1'
				})
			}
		},
		async onReachBottom() {
			console.log("onReachBottom");
			if (this.list.length == this.total) {
				this.loadingType = 'no-more'
				return;
			}
			this.loadingType = 'loading'
			this.pageData.pageNum += 1
			this.getList()
		},
		onShow() {
			this.selectId = uni.getStorageSync('contestId');
			console.log(this.selectId)
			this.pageData = {
				pageNum: 1,
				pageSize: 20
			}
			this.list = []
			this.getList();
		}
	}
</script>

<style scoped lang="scss">
	.list {
		display: flex;
		padding: 30rpx 30rpx;
		justify-content: space-between;
		align-items: center;
		border-bottom: 1px solid #ddd;

		image {
			width: 80rpx;
			height: 80rpx;
			margin-right: 30rpx;
		}

		&.cur {
			background-color: #FBF0EE;
		}

		.item {
			display: flex;

			.center {
				display: flex;
				flex-direction: column;
				font-size: 26rpx;
				justify-content: space-between;

				text {

					&:nth-child(1) {
						font-weight: 600;
					}

					&:nth-child(2) {
						font-size: 25rpx;
						//color: $font-color;
					}
				}
			}
		}

		.status {
			display: flex;
			color: #766E6B;
			font-size: 24rpx;
		}

	}
</style>